<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
    <title>index</title>
</head>
<body>
    <div class="container">
        <div class="part part1">
            <div class="header">
                <div class="header_wrap" id="index">
                    <div class="search">
                        <a href="javascript:;"><img src="./images/index_search.png" alt=""></a>
                        <input type="text">
                    </div>
                    <a href="./server.html"><img src="./images/index_msg.png" alt="" class="msg"></a>
                </div>
            </div>
            <div class="carousel">
                <ul></ul>
                <ol></ol>
            </div>
            <div class="classify">
                <div class="classify_wrap">
                    <div class="item margin40">
                        <a href="./classify.html"><img src="./images/classify.png" alt=""></a>
                        <a href="./classify.html">美妆洗护</a>
                    </div>
                    <div class="item margin40">
                        <a href="./classify.html"><img src="./images/classify2.png" alt=""></a>
                        <a href="./classify.html">居家日用</a>
                    </div>
                    <div class="item margin40">
                        <a href="./classify.html"><img src="./images/classify3.png" alt=""></a>
                        <a href="./classify.html">运动户外</a>
                    </div>
                    <div class="item margin40">
                        <a href="./classify.html"><img src="./images/classify4.png" alt=""></a>
                        <a href="./classify.html">酒零水果</a>
                    </div>
                    <div class="item margin40">
                        <a href="./classify.html"><img src="./images/classify5.png" alt=""></a>
                        <a href="./classify.html">教育教材</a>
                    </div>
                    <div class="item">
                        <a href="./classify.html"><img src="./images/classify6.png" alt=""></a>
                        <a href="./classify.html">母婴奶粉</a>
                    </div>
                    <div class="item">
                        <a href="./classify.html"><img src="./images/classify7.png" alt=""></a>
                        <a href="./classify.html">鞋包装饰</a>
                    </div>
                    <div class="item">
                        <a href="./classify.html"><img src="./images/classify8.png" alt=""></a>
                        <a href="./classify.html">保健营养</a>
                    </div>
                    <div class="item">
                        <a href="./classify.html"><img src="./images/classify9.png" alt=""></a>
                        <a href="./classify.html">手机家电</a>
                    </div>
                    <div class="item">
                        <a href="./classify.html"><img src="./images/classify10.png" alt=""></a>
                        <a href="./classify.html">温州特产</a>
                    </div>
                </div>
            </div>
            <div class="ad">
                <a href="./details.html"><img src="./images/advertisement.png" alt=""></a>
            </div>
            <div class="district">
                <div class="district_wrap">
                    <div class="districtUp">
                        <div class="item">
                            <a href="./shoplist.html"><img src="./images/districtUp1.png" alt=""></a>
                        </div>
                        <div class="item">
                            <a href="./shoplist.html"><img src="./images/districtUp2.png" alt=""></a>
                        </div>
                    </div>
                    <div class="districtDown">
                        <div class="item">
                            <div class="text">
                                <div class="font">
                                    <h3>
                                        日用区
                                    </h3>
                                    <p>玫瑰花沐浴霸</p>
                                </div>
                                <a href="./shoplist.html">查看</a>
                            </div>
                        </div>
                        <div class="item">
                            <div class="text">
                                <div class="font">
                                    <h3>
                                        水果区
                                    </h3>
                                    <p>新鲜水果</p>
                                </div>
                                <a href="./shoplist.html">查看</a>
                            </div>
                        </div>
                        <div class="item">
                            <div class="text">
                                <div class="font">
                                    <h3>
                                        零食区
                                    </h3>
                                    <p>坚果饼干</p>
                                </div>
                                <a href="./shoplist.html">查看</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="timeClose">
                <div class="left">
                    <p>限时</p>
                    <p>抢购</p>
                </div>
                <div class="line"></div>
                <div class="right">
                    <div class="item active">
                        <h4>10:00</h4>
                        <a href="javascript:;">抢购中</a>
                    </div>
                    <div class="item">
                        <h4>12:00</h4>
                        <a href="javascript:;">预热中</a>
                    </div>
                    <div class="item">
                        <h4>14:00</h4>
                        <a href="javascript:;">预热中</a>
                    </div>
                    <div class="item">
                        <h4>16:00</h4>
                        <a href="javascript:;">预热中</a>
                    </div>
                    <div class="item">
                        <h4>18:00</h4>
                        <a href="javascript:;">预热中</a>
                    </div>
                </div>
            </div>
            <div class="buynow">
                <div class="content">
                    <div class="buynow_item">
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow1.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">修文鸭舌头酱鸭舌温州特产原味鸭舌鸭肉休闲零食大礼包称重500g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow2.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">桂花糕温州特产厂家批发手工传统糕点夹心糯米糕250g 3盒750g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow3.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">意大利进口 wc net 厕所清洁剂浓缩凝胶瓷砖清洁剂除垢消毒洁厕</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="buynow_item">
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow1.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">修文鸭舌头酱鸭舌温州特产原味鸭舌鸭肉休闲零食大礼包称重500g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow2.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">桂花糕温州特产厂家批发手工传统糕点夹心糯米糕250g 3盒750g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow3.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">意大利进口 wc net 厕所清洁剂浓缩凝胶瓷砖清洁剂除垢消毒洁厕</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="buynow_item">
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow1.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">修文鸭舌头酱鸭舌温州特产原味鸭舌鸭肉休闲零食大礼包称重500g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow2.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">桂花糕温州特产厂家批发手工传统糕点夹心糯米糕250g 3盒750g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow3.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">意大利进口 wc net 厕所清洁剂浓缩凝胶瓷砖清洁剂除垢消毒洁厕</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="buynow_item">
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow1.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">修文鸭舌头酱鸭舌温州特产原味鸭舌鸭肉休闲零食大礼包称重500g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow2.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">桂花糕温州特产厂家批发手工传统糕点夹心糯米糕250g 3盒750g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow3.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">意大利进口 wc net 厕所清洁剂浓缩凝胶瓷砖清洁剂除垢消毒洁厕</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="buynow_item">
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow1.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">修文鸭舌头酱鸭舌温州特产原味鸭舌鸭肉休闲零食大礼包称重500g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow2.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">桂花糕温州特产厂家批发手工传统糕点夹心糯米糕250g 3盒750g</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <a href="./details.html"><img src="./images/index_buynow3.png" alt=""></a>
                            <div class="right">
                                <p class="title"><a href="./details.html">意大利进口 wc net 厕所清洁剂浓缩凝胶瓷砖清洁剂除垢消毒洁厕</a></p>
                                <div class="msg">
                                    <p><span>￥</span>99.0<i>￥115.0</i></p>
                                    <div class="button">
                                        <h4>马上抢</h4>
                                        <div class="progress">
                                            <div class="track">
                                                <div class="thumb">
                                                </div>
                                            </div>
                                            <p>60%</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="hotbg">
                <h3>热销榜</h3>
            </div>
            <div class="buynow hot">
                <div class="item">
                    <a href="./details.html"><img src="./images/index_buynow1.png" alt=""></a>
                    <div class="right">
                        <p class="title"><a href="./details.html">修文鸭舌头酱鸭舌温州特产原味鸭舌鸭肉休闲零食大礼包称重500g</a></p>
                        <div class="msg">
                            <p><span>￥</span>115.0.0</p>
                            <a href="./details.html">立即查看</a>
                        </div>
                    </div>
                </div>
                <div class="item">
                    <a href="./details.html"><img src="./images/index_buynow2.png" alt=""></a>
                    <div class="right">
                        <p class="title"><a href="./details.html">桂花糕温州特产厂家批发手工传统糕点夹心糯米糕250g 3盒750g</a></p>
                        <div class="msg">
                            <p><span>￥</span>29.0</p>
                            <a href="./details.html">立即查看</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="more">
                <img src="./images/index_more.png" alt="">
            </div>
        </div>
    </div>
    <footer>
        <div class="footer">
            <div class="item active">
                <a href="./index.html"><img src="./images/index_footer11.png" alt=""></a>
                <p><a href="./index.html">主页</a></p>
            </div>
            <div class="item">
                <a href="./classify.html"><img src="./images/index_footer21.png" alt=""></a>
                <p><a href="./classify.html">分类</a></p>
            </div>
            <div class="item">
                <a href="./shopcart.html"><img src="./images/index_footer31.png" alt=""></a>
                <p><a href="./shopcart.html">购物车</a></p>
            </div>
            <div class="item">
                <a href="./usercenter.html"><img src="./images/index_footer41.png" alt=""></a>
                <p><a href="./usercenter.html">我的</a></p>
            </div>
        </div>
    </footer>

    <script src="./js/rem.js"></script>
    <script src="./js/tools.js"></script>
    <script src="./js/count.js"></script>
    <script>
        touchmove('.buynow .content','.timeClose .right')

        goNext('.button','./details.html')
        goNext('input','./searchtwo.html')
        

        new Tabs({
            choice:'.timeClose .right',
            change:'.buynow .content',
            mode:'move'
        })

        new Carousel('.carousel',{
            autoPlay:true,
            speed:3000,
            datalist:[
                {
                    smallImg:'./images/carousel1.png'
                },
                {
                    smallImg:'./images/carousel2.png'
                },
                {
                    smallImg:'./images/carousel1.png'
                },
                {
                    smallImg:'./images/carousel2.png'
                }
            ]
        })


        function touchmove(slide,active) {
				const wrap = document.querySelector(slide);
				const choice = document.querySelector(active);
				let start = 0,
					begin = 0,
					num = 0;

				wrap.addEventListener("touchstart", function (e) {
					begin = 0;
					start = 0;
					start = e.targetTouches[0].clientX;
				});
				wrap.addEventListener("touchmove", function (e) {
					wrap.style.transition = "none";
					begin = start - e.targetTouches[0].clientX;
					if (num === 0 && begin < 0) {
						begin = 0;
						num = 0;
					}
					if (num === wrap.children.length - 1 && begin > 0) {
						begin = 0;
						num = this.children.length - 1;
					}
					let a = wrap.children[0].offsetWidth * num;
					this.style.marginLeft = -begin + -a + "px";
				});
				wrap.addEventListener("touchend", function () {
					if (Math.abs(begin) > wrap.children[0].offsetWidth / 5) {
						if (begin > 0) {
							num++;
						} else if (begin < 0) {
							num--;
						}
					}
					autoClass(choice.children, "active", num);
					wrap.style.transition = ".3s";
					wrap.style.marginLeft = -num * 100 + "%";
				});
			}
    </script>
</body>
</html>